/**
 * DOM 操作封装
 */

//封装DOM加载事件
/*
DOMContentLoaded和load的区别
    load: 表示当网页中所有资源加载完成后,才能执行后面的回调函数
    DOMContentLoaded:表示当网页中DOM节点加载完成后,就可以执行 后面的回调函数  ---快一点


    
window.addEventListener('load',function(){

})

window.addEventListener('DOMContentLoaded',function(){

})

*/

const https = require('../utils/https');
function ready(callback){
    window.addEventListener('DOMContentLoaded',callback)
}


//封装操作DOM-单个操作
function getEle(selector){
    return document.querySelector(selector);
}

//封装操作DOM-多个操作
function getEles(selector){
    return document.querySelectorAll(selector);
}
 
//封装注册事件功能
function addEvent(obj,callback,type='click'){
    getEle(obj).addEventListener(type,callback)
}

//封装底部菜单
function bMenu(obj){
     //js实现底部原理
     document.body.innerHTML+=`
     <footer>
     <ul class="df tcenter f12 bgcff">
       <li><a href="home.html" class="${obj=='home'?'active':''}"><i class="iconfont icon-home"></i><span>首页</span></a></li>
       <li><a href="sport.html" class="${obj=='sport'?'active':''}"><i class="iconfont icon-ball"></i><span>运动</span></a></li>
       <li><a href="circle.html" class="${obj=='circle'?'active':''}"><i class="iconfont icon-circle"></i><span>圈子</span></a></li>
       <li><a href="my.html" class="${obj=='my'?'active':''}"><i class="iconfont icon-mine"></i><span>我的</span></a></li>
     </ul>
   </footer>
     `
}

//封装单图像上传功能
/*
    callback=function(res){
        
       }


     function callback(res){
        
       }  
*/
//封装文件上传功能
function upLoadPic(url,key,val,cb){
    let fd=new FormData();
    fd.append(key,val);
    https.post(url,fd,cb)
}

//处理 小于10的数字为两位格式
function formatDate(val){
    //基本操作
    // if(val<10){
    //     val='0'+val;
    // }else{
    //     val=val
    // }

    return val<10?'0'+val:val;

}

//导出
module.exports={
    ready,
    getEle,
    getEles,
    addEvent,
    bMenu,
    upLoadPic,
    formatDate
}

